import { Component, OnInit, Inject,HostBinding } from '@angular/core';
import { FormControl } from '@angular/forms';
import { Observable } from 'rxjs/Observable';

import { MatDialog } from '@angular/material';
import 'rxjs/add/operator/startWith';
import 'rxjs/add/operator/map';

import { UserService } from './user.service';
import { DialogOverviewCommonService } from './dialog-overview-common.server'
import { User } from './user';
import { DialogOverviewCommonComponent } from './dialogOverviewCommon.component';
import { slideInDownAnimation } from './animations';

@Component({
  selector: 'app-root',
  templateUrl: './add.component.html',
  styleUrls: ['./add.component.css'],
  providers: [UserService, DialogOverviewCommonService],
  animations: [ slideInDownAnimation ]
})


export class AddComponent {
  @HostBinding('@routeAnimation') routeAnimation = true;
  @HostBinding('style.display')   display = 'block';
  user: User = new User();
  result: String;
  error: String;
  constructor(
    private userService: UserService,
    private dialogOverviewCommonService: DialogOverviewCommonService,
    private dialog: MatDialog
  ) { }

  add(): void {
    this.clearMsg();
    this.userService.addUser(this.user).subscribe(
      data => {
        this.result = data;
        this.dialogOverviewCommonService.openDialog(this.dialog, this.result, this.error);
      },
      error => {
        this.error = error;
        this.dialogOverviewCommonService.openDialog(this.dialog, this.result, this.error);
      }
    );

  }

  clearMsg(): void {
    this.result = null;
    this.error = null;
  }

}
